<template>
	<view v-if="hasLogin">	
		<!-- 刷新页面后的顶部提示框 -->
		<view class="tips" :class="{ 'tips-ani': tipShow }">已经是最新的作业了</view>
		<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="formData" :collection="collectionList"
		 @load="load">
		<view v-if="error">{{error.message}}</view>
		<view v-else-if="loading">正在加载...</view>
		<!-- 基于 uni-card 的页面布局 to进入到详情页  -->
		<view v-for="item in data" :key="item._id" v-show="item.class_id[0].user_id.includes(userInfo._id)"  >
			<!-- 通过header插槽定义列表顶部显示为图片 -->
			<uni-card>
				<view class="">
				</view>
					<view class="">
						<uni-dateformat :date="item.create_homework_time"></uni-dateformat>
					</view>
					<!-- <view class="uni-title" >{{item.class_id[0]["text"]}}</view> -->
					<view class="uni-title">作业标题:{{item.homework_title}}</view>
					<view class="uni-title" >作业详情:{{item.homework_detail}}</view>
					<view class="" v-for="img in item.homework_image" :key="img.path">
						<cover-image :src="img.url" @tap="previewImage(img.url)"></cover-image>
					</view>
					<!-- <view class="uni-thumb uni-content list-picture"> -->
						<!-- 当前判断长度只为简单判断类型，实际业务中，根据逻辑直接渲染即可 -->
						<!-- <image :src="item.avatar.length > 3?item.avatar : item.avatar[0]" mode="aspectFill"></image> -->
					<!-- </view> -->
			</uni-card>
		</view>

		<!-- 通过 loadMore 组件实现上拉加载效果，如需自定义显示内容，可参考：https://ext.dcloud.net.cn/plugin?id=29 -->
		<uni-load-more v-if="loading || options.status === 'noMore' " :status="options.status" />
		</unicloud-db>
	</view>
	<!-- 请输入邀请码 -->
	<view class="" v-else>
		<p>没有登录</p>
	</view>
</template>

<script>
	import {
		store,
		mutations
	} from '@/uni_modules/uni-id-pages/common/store.js'
	const db = uniCloud.database()
	export default {
		components: {},
		data() {
			return {
				user_id:"",
				// 数据表名
				// collection: 'opendb-news-articles',
				// collection: 'class-list,assig-homework',
				collectionList: [db.collection('assig-homework').field(
						'class_id,homework_title,homework_detail,homework_image,homework_video,create_homework_time,is_show').getTemp(), db
					.collection('class-list').field('_id,class_name as text,invitation_code,user_id').getTemp()
				],
				formData: {
					status: 'loading' // 加载状态
				},
				tipShow: false // 是否显示顶部提示框
			};
		},
		onLoad() {		
			// 调用是否登录函数
			this.isLogin()
			// 调用是否有班级函数
			this.isClass()
		},
		methods: {
			// 判断用户是否登录,如果没有登录就提示用户登录
			isLogin(){
				// 获取用户是否登录,并赋值给变量
				let hasLogin2 = store.hasLogin
				// 看是否登录,如果没有登录提示用户跳转到登录页面
				if(hasLogin2){
					console.log("已经登录了");
					return hasLogin2
				}else{
					console.log("还没登录");
					// 调用uni.showModal弹出登录提示框，引导用户点击登录按钮
					uni.showModal({
						title: '提示',
						content: '您还没有登录，是否前往登录？',
						success: function(res) {
							if (res.confirm) {
								console.log('用户点击确定');
								// 跳转到登录页面
								uni.navigateTo({
									url: '/uni_modules/uni-id-pages/pages/login/login-withoutpwd',
								})

							} else if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					});
					return hasLogin2
				}
			},
			// 如果用户登录,查看用户是否有班级,如果没有提示用户输入邀请码
			isClass(){
				// 调用用户是否登录函数,查看返回的是否登录
				let hasLogin2 = this.isLogin()
				console.log("hasLogin2",hasLogin2);
				// 查看是否有班级
				if(hasLogin2){
					// 获取用户信息
					let userInfo = store.userInfo
					console.log("userInfo",userInfo);
					// 获取用户id
					let user_id = userInfo._id
					console.log("user_id",user_id);
					// 在班级数据库里查看是否有用户id
					db.collection('class-list').where({
						user_id: user_id
					}).get().then(res => {
						// console.log("res",res.data.length);
						let classList = res.result.data
						// console.log("classList",classList);
						// 查看classList 如果有数据查看长度
						if(classList.length > 0){
							console.log("有班级");
							return
						}else{
							let that = this
							console.log("没有班级");
							// 如果没有班级就弹出有editable输入邀请码的提示框
							uni.showModal({
								title: '提示',
								// content: '您还没有班级，是否前往输入邀请码？',
								editable: true,
								placeholderText: '请输入邀请码',
								success: function(res) {
									if (res.confirm) {
										// console.log('用户点击确定',that);
										// 调用验证码是否正确 this指向问题
										that.isInvitationCode(res.content)	
																		
									} else if (res.cancel) {
										console.log('用户点击取消');
									}
								}
							});
							
						}
					})
					
					
				}
			},
			// 邀请码是否正确
			isInvitationCode(res){
				console.log("isInvitationCoderes",res);
				// 获取用户输入的邀请码
				let invitation_code = res
				// 将invitation_code转换成整数
				invitation_code = parseInt(invitation_code)
				// 在班级数据库里查看是否有用户id
				db.collection('class-list').where({
					invitation_code: invitation_code
				}).get().then(res => {
					//获取用户id
					let userInfo = store.userInfo
					let user_id = userInfo._id
					// 获取班级列表数据
					let classList = res.result.data
					console.log("classList",classList);
					
					// 查看classList 如果有数据查看长度
					if(classList.length > 0){
						console.log("邀请码正确");
						// 获取班级数据库里的user_id
						let user_id2 = classList[0].user_id
						// 将user_id添加到user_id2里
						user_id2.push(user_id)
						// 将user_id添加push到班级数据库里
						db.collection('class-list').where({
							invitation_code: invitation_code
						}).update({
							user_id: user_id2
						}).then(res => {
							console.log("添加成功",res);
							// 刷新当前页面
							uni.reLaunch({
								url: '/pages/list/homework/homework'
							})
						}).catch(err => {
							console.log("添加失败",err);
						})	
						
						
					}else{
						console.log("邀请码错误");
						let that = this
					// 	如果没有班级就弹出有editable输入邀请码的提示框
						uni.showModal({
							title: '提示',
							// content: '邀请码错误，请重新输入',
							editable: true,
							placeholderText: '邀请码错误，请重新输入',
							success: function(res) {
								if (res.confirm) {
									console.log('用户点击确定');
									// 获取用户输入的邀请码
									let invitation_code = res.content
									console.log("invitation_code",invitation_code);
									// 递归调用
									that.isInvitationCode(invitation_code)
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						});
						
					}
				})
			},
			
			// 预览图片
			previewImage(url) {
				//字符转化成数组 split直接转化成一个元素,不会将字符串字符分开
				let array_url = url.split()
				//uniapp预览轮播图
				uni.previewImage({
					// current: index, //预览图片的下标
					urls: array_url //预览图片的地址，必须要数组形式，如果不是数组形式就转换成数组形式就可以
				})
			},
			load(data, ended) {
				if (ended) {
					this.formData.status = 'noMore'
				}
			}
		},
		computed:{
			// 是否登录
			hasLogin(){
				// console.log("hasLogin");
				// 返回store.hasLogin
				return store.hasLogin
			},
			userInfo(){
				return store.userInfo
			}
		},
		/**
		 * 下拉刷新回调函数
		 */
		onPullDownRefresh() {
			this.formData.status = 'more'
			this.$refs.udb.loadData({
				clear: true
			}, () => {
				this.tipShow = true
				clearTimeout(this.timer)
				this.timer = setTimeout(()=>{
					this.tipShow  = false
				},1000)
				uni.stopPullDownRefresh()
			})
		},
		/**
		 * 上拉加载回调函数
		 */
		onReachBottom() {
			this.$refs.udb.loadMore()
		}
	};
</script>

<style lang="scss">
	@import '@/common/uni-ui.scss';

	page {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: #efeff4;
		min-height: 100%;
		height: auto;
	}

	.tips {
		color: #67c23a;
		font-size: 14px;
		line-height: 40px;
		text-align: center;
		background-color: #f0f9eb;
		height: 0;
		opacity: 0;
		transform: translateY(-100%);
		transition: all 0.3s;
	}

	.tips-ani {
		transform: translateY(0);
		height: 40px;
		opacity: 1;
	}

	.content {
		width: 100%;
		display: flex;
	}

	.list-picture {
		width: 100%;
		height: 145px;
	}

	.thumb-image {
		width: 100%;
		height: 100%;
	}

	.ellipsis {
		display: flex;
		overflow: hidden;
	}

	.uni-ellipsis-1 {
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.uni-ellipsis-2 {
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	
</style>
